<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8" name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
    <title>洗亦注册</title>
    <link rel="stylesheet" href="register.css">
    <style>
        .mask{
            position: absolute;
            padding: 0.5em;
            border-radius: 1vw;
            background: rgba(0,0,0,0.7);
            top:50%;
            left: 50%;
            transform: translate(-50%,-70%);
            color: #FFFFFF;
        }
    </style>
    <script src="jquery-3.7.1.min.js"></script>
    <script src="register.js"></script>
</head>
<body>
    <div class="container">
        <div class="content">
            <div class="logo img">
                <div class="logo-img img"></div>
            </div>
            <form action="register.js" method="post" onsubmit="register()" id="myForm">
                <div class="form">
                    <div class="input">
                        <div class="input-head">+86</div>
                        <div class="deliver-line"></div>
                        <label>
                            <input type="number" id="phone" name="phone" value="" placeholder="请输入电话号码" onblur="verifyPhone(this.value)" />
                        </label>
                    </div>
                    <span class="phone-error error">电话号码输入错误</span>
                    <div class="input">
                        <label>
                            <input type="password" id="password" name="password" placeholder="请输入密码" onblur="verifyPassword(this.value)" />
                        </label>
                    </div>
                    <span class="password-error error">密码不能为空</span>

                    <div class="input verification">
                        <label>
                            <input type="text"  id="verification" name="verification" placeholder="请输入验证码"/>
                        </label>
                        <div class="verification-img" id="verification_img">
                        </div>
                    </div>
                    <span class="verify-error error">验证码错误</span>
                    <div class="input">
                        <label>
                            <input type="text" id="invite-code" name="invite-code"  class="invite-code" placeholder=""  value="" disabled  />
                        </label>
                    </div>
                </div>
                <div class="submit">
                    <div class="input submit-btn" id="submit">
                        注册
                    </div>
<!--                    <div class="input download" onclick="window.location.href='http://xiyih5.wlxp365.com/apk/1.0.0/20240413122737.apk'" >-->
                    <div class="input download" onclick="window.location.href='../download/download.html'" >
                        已注册，直接下载
                    </div>
                </div>
            </form>

        </div>
    </div>
    <div class="mask">
        注册成功，跳转至下载页面
    </div>
</body>
<script>
    $('.mask').hide();
    function GetQueryString(name) {
        var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i");
        var r = window.location.search.substring(1).match(reg); //获取url中"?"符后的字符串并正则匹配
        var context = "";
        if (r != null)
            context = decodeURIComponent(r[2]);
        reg = null;
        r = null;
        return context == null || context === "" || context === "undefined" ? "" : context;
    }
    console.log("邀请码为",GetQueryString("invite_code"));//invite_code
    $("#invite-code").val(GetQueryString("invite_code"))

    var verifyCode = new GVerify("verification_img");
    document.getElementById("submit").onclick = function(){
        var res = verifyCode.validate(document.getElementById("verification").value);
        let phone=$("#phone").val();
        let password=$("#password").val();
        let inviteCode=$("#invite-code").val();
        if(!verifyPhone(phone)&&!verifyPassword(password)&&!res){
            return
        }
        if(!res){
            $(".verify-error").css("display","block");
            return;
        }else {
            $(".verify-error").css("display","none");
        }
        let data={
            userPassword: password,
            moble: phone,
            pushUserCode:inviteCode
        }
        $.ajax({
            url: 'http://xiyi.wlxp365.com/nt/user/channel/register', // 请求的 URL
            type: 'POST', // 请求类型
            data: JSON.stringify(data), // 发送到服务器的数据
            contentType: 'application/json',
            success: function(data) {
                if(data.code) {
                    alert(data.msg)
                    return;
                }else {
                    $('.mask').show(0, function() { // 直接显示元素，不带动画
                        $(this).delay(1000).queue(function(next) { // 延迟3秒
                            $('.mask').hide()
                            window.location.href = "../download/download.html"; // 跳转到指定页面
                            next(); // 继续执行队列中的下一个函数
                        });
                    });
                }
                },
            error: function(xhr, status, error) {
                // 请求失败时的回调函数
                console.error('An error occurred:', status, error);
            }
        })


    }
</script>
</html>